<template>
  <div class="bg-light">
    <homeTable
        :list="list" :translate='10'
        @getData="getData"
        @onPageSizeChange="onPageSizeChange"
        @onPageChange="onPageChange"
      />
    <detailModal ref="detailModal"></detailModal>
  </div>
</template>
<script>
  import homeTable from '@/components/homeTable'
  import detailModal from './ChangeInfoDetailModalItem'
  import { renderButton } from '@/util';

  export default {
    props: {
      form: {
        type: Object
      }
    },
    components: {
      homeTable,
      detailModal
    },
    data() {
      return {
        list: {
          status: 'pass',
          totalItem: 1,
          pageSize: window.$pageSize,
          currentPage: 1,
          columns: [{
            title: '变更时间',
            key: 'createDate',
            align: 'left',
          }, {
            title: '变更提交人',
            key: 'operator',
            align: 'left',
          }, {
            title: '变更类型',
            key: 'applyTypeStr',
            align: 'left',
          }, {
            title: '操作',
            key: 'createDate',
            align: 'left',
            render: (h, params) => {
              return (
                <div>
                  { renderButton(h, { text: '查看' }, ()=>{ this.changeDetail(params.row)})}
                </div>
              )
            }
          }],
          data: []
        },
        show: false
      }
    },
    mounted () {
      this.getData()
    },
    methods: {
      getData() {
        let contractId = this.form.storeContractDTO.id
        if(!contractId) return
        let param = {
          contractId,
          current: this.list.currentPage,
          size: this.list.pageSize
        };
        this.list.status = "loading";
        this.$ajaxGet(`/contract_store/detail_changelog/${contractId}`, param).then(data => {
          this.list.totalItem = Number(data.total)
          this.list.data = (data.records || [])
          this.list.status = "pass";
        })
        .catch(() => {
          this.list.status = "error";
        });
      },
      changeDetail(row) {
        this.$refs.detailModal.openModal(row)
      },
      onPageChange(p) {
        this.list.currentPage = p
        this.getData()
      },
      onPageSizeChange(p) {
        this.list.pageSize = p
        this.getData()
      },
    },
    computed: {

    }
  }
</script>
